<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="css/TravelTools.css" /><!-- 页面css -->
		<link rel="stylesheet" type="text/css" href="css/address.css"><!-- 页面四级联动 -->
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title></title>
	</head>
	<body>
		<div class="top">
			<div class="top_pic">
				<div class="top_font">
					<h1>旅行工具</h1>
					<h2>Travel tool</h2>
					<a href="/" class="_back">
						<img src="../aboutus/img/back.png" >
						<p>返回主页</p>
					</a>
				</div>

			</div>
		</div>

		<div class="content">
			<div class="content_center">
				<button class="_button">天气预报</button>
				<button class="_button">地铁线路</button>
				<button class="_button">旅游地图</button>
				<button class="_button">汇率换算</button>



				<div class="line">
					<div class="_top">
						<div class="_top_poisition">
							<img class="_position" src="img/poisition.png">
							<p class="_poisition_p">目的地</p>
							<ul class="_position_ul">
								<li>默认</li>
								<li>伦敦</li>
								<li>高地</li>
								<li>爱丁堡</li>
								<li>罗马</li>
								<li>爱尔兰</li>
								<li style="width: 68px;">贝尔法斯特</li>
								<li>威尼斯</li>
								<li style="width: 65px;">弗洛伦萨</li>
								<li>米兰</li>
								<li style="width: 68px;">杜赛尔多夫</li>
								<li>鹿特丹</li>
							</ul>
							<div class="_more_city">
								<input class="weatherquery" type="text" placeholder="请输入您要查询的地址" /><span id="_unit">:市</span> <button class="weatherbtn"
								 type="button">查询</button>
							</div>
						</div>

					</div>


					<div id="div_weather" class="_show1" other='<div>'>
						<!-- 天气 -->
					</div>
				</div>


				<div class="line">
					<div class="_top">
						<div class="_top_poisition">
							<img class="_position" src="img/poisition.png">
							<p class="_poisition_p">目的地</p>
							<ul class="_position_ul">
								<li>默认</li>
								<li>伦敦</li>
								<li>高地</li>
								<li>爱丁堡</li>
								<li>罗马</li>
								<li>爱尔兰</li>
								<li style="width: 68px;">贝尔法斯特</li>
								<li>威尼斯</li>
								<li style="width: 65px;">弗洛伦萨</li>
								<li>米兰</li>
								<li style="width: 68px;">杜赛尔多夫</li>
								<li>鹿特丹</li>
							</ul>
							</p><select id="_citychoice"></select>
						</div>

					</div>

					<div id="container"></div>


				</div>


				<div class="line">
					<div class="_top">
						<div class="_top_poisition">
							<img class="_position" src="img/poisition.png">
							<p class="_poisition_p">目的地</p>
							<ul class="_position_ul">
								<li>默认</li>
								<li>伦敦</li>
								<li>高地</li>
								<li>爱丁堡</li>
								<li>罗马</li>
								<li>爱尔兰</li>
								<li style="width: 68px;">贝尔法斯特</li>
								<li>威尼斯</li>
								<li style="width: 65px;">弗洛伦萨</li>
								<li>米兰</li>
								<li style="width: 68px;">杜赛尔多夫</li>
								<li>鹿特丹</li>
							</ul>
							<!-- <p><input type="text" id = 'map_address'></p> -->
							<input id='map_address' />
						</div>
					</div>
					<div id="container_map" class="map"></div>
				</div>


				<div class="line  conversion">
					<div class="inputbox">
						<input type="text" value="" id="field23738" />
						<img src="img/conversion.png">
						<input type="" value="" id="field23739" />
						<button type="button" id="parities_btn">汇率换算</button>
					</div>
					<div class="table">
						<div id="" style="background-color: #EEF0FD;">
							<h3 class="conversion_top">按当前汇率换算结果</h3>
							<select class="money" id="field23737">
								        <option value="1">美元 USD</option>
								        <option value="2">欧元EUR</option>
								        <option value="3">日元JPY</option>
								        <option value="4">港元HKD</option>
								        <option value="5">英镑GBP</option>
								        <option value="6">澳元AUD</option>
								        <option value="7">卢布RUB</option>
								        <option value="8">韩元KRW</option>
								        <option value="9">新元SGD</option>
								 </select>
							<p class="rmb">人民币(RMB)</p>
						</div>

						<div id="table_second">
							<p>人民币</p>
							<p>当前汇率</p>
							<p id="changemoney_">美元</p>
						</div>
						<div id="table_third">
							<p id="_rmb">0</p>
							<p id="parities">0</p>
							<p id="changemoney">0</p>
						</div>
					</div>
				</div>
			</div>



		</div>
		<div id="addressSelectWrapper">
			<div id="addressSelect">
				<div class="tip">
					<h3>所在地区</h3>
					<button type="button" id="cancel"></button>
				</div>
				<div id="address">
					<ul class="selected-address">
						<li class="lastarea" id="lastprovince">请选择</li>
						<li class="lastarea" id="lastcity">请选择</li>
						<li class="lastarea" id="lastarea">请选择</li>
						<li class="lastarea" id="lasttown">请选择</li>
					</ul>
					<div class="address-content">
						<ul id="province"></ul>
						<ul id="city"></ul>
						<ul id="area"></ul>
						<ul id="town"></ul>
					</div>
				</div>
			</div>
		</div>

		<div class="footer_all">
			<div class="footer">
				<div class="us">
					<div class="logo">
						<h1>logo</h1>
					</div>
					<div class="second">
						<img src="img/phone.png">
						<img src="img/mailbox.png">
						<img src="img/companyaddress.png">
						<div class="_aboutus">
							<p>2012-21325122</p>
							<p>121352135@163.com</p>
							<p>中国深圳市龙华去1208号2403</p>
						</div>
					</div>
					<div class="third">
          <a href="/tool/aboutus/aboutus.html">
            <p>关于我们</p>
          </a>
          <a href="/tool/aboutus/help.html">
            <p>新手上路</p>
          </a>
          <a href="/tool/aboutus/contact_us.html">
            <p>联系我们</p>
          </a>
          <a href="/tool/aboutus/greenhand.html">
            <p>使用帮助</p>
          </a>
          <a href="/tool/aboutus/partner.html">
            <p>合作伙伴</p>
          </a>
          <a href="/tool/index.html">
							<p>旅行工具</p>
						</a>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script><!-- jquery -->
	<script src="js/Traveltools.js" type="text/javascript" charset="utf-8"></script><!-- 顶部导航分页 -->
	<script src="../../js/jquery.leoweather.all.js" type="text/javascript" charset="utf-8"></script><!-- 天气 -->
	<script type="text/javascript" src="https://api.map.baidu.com/api?type=subway&v=1.0&ak=kw3S7B8XuDIprixUts8txWSvgVUVlL7n"></script><!-- 百度地铁图 -->
	<script src="https://webapi.amap.com/maps?v=1.4.15&key=3ae16a8ed8233f3535a0c4777937e2b1&plugin=AMap.PlaceSearch,AMap.AdvancedInfoWindow"></script><!-- 高德地图 -->
	<script src="js/map.js" type="text/javascript" charset="utf-8"></script><!-- 高德地图js -->
	<script src="js/subway.js" type="text/javascript" charset="utf-8"></script><!-- 地铁js -->
	<script src="js/city.js"></script>
	<script type="text/javascript">
		var place = "";
		$(".weatherbtn").click(function() {
			place = $(".weatherquery").val();
			$('#div_weather').html(WeatherHtml.setobj(Getweather(place)));
		});
		var data = Getweather(place);
		console.log(data);
		var Weather = data;

		WeatherHtml = '<div id="show_first">' +
			'<img src="https://xuesax.com/tianqiapi/skin/cake/{"图标"}.png" />' +
			'<p class="_show1_place">{"城市"}</p>' +
			'<p class="_show1_today">今天<span id="_show1_date">{"月"}/{"日"} {"周"}</span></p>' +
			'<p class="_show1_temperature">{"最高气温"}</p>' +
			'<p class="_show1_air">风力：<span id="_show1_rank">{"风级"}</span>  空气质量：<span _show1_grade>{"空气等级"}</span></p>' +
			'<p class="_show1_suntime">最低气温:<span id="_show1_suntimef">{"最低气温"}</span> · 最高气温:<span id="_show1_suntimel">{"最高气温"}</span></p>' +
			'</div>' +
			'<div id="show_second">' +
			'<p class="_show2_tomorrow _mg">{"日期1"}<span class="wind">风力:<span>{"风级1"}</p>' +
			'<p class="_mg">空气质量:<span class="atmosphere"><span>{"空气等级"}</span></span></p>' +
			'<p class="_mg"><span class="lastTemperature">最低气温:{"最低气温1"}</span><span>最高气温:{"最高气温1"}</span></p>' +
			'<p class="_img"><img src="https://xuesax.com/tianqiapi/skin/cake/{"图标1"}.png" ></p>' +
			'<p class="_temperature">{"最高气温1"}</p>' +
			'<p class="weatherChange">{"天气1"}</p>' +
			'<p class="_weatherHint">{"空气提示"}</p>' +
			'</div>' +
			'<div id="show_third">' +
			'<p class="_show2_tomorrow _mg">{"日期2"}<span class="wind">风力:<span>{"风级2"}</p>' +
			'<p class="_mg">空气质量:<span class="atmosphere"><span>{"空气等级"}</span></span></p>' +
			'<p class="_mg"><span class="lastTemperature">最低气温:{"最低气温2"}</span><span>最高气温:{"最高气温2"}</span></p>' +
			'<p class="_img"><img src="https://xuesax.com/tianqiapi/skin/cake/{"图标2"}.png" ></p>' +
			'<p class="_temperature">{"最高气温2"}</p>' +
			'<p class="weatherChange">{"天气2"}</p>' +
			'<p class="_weatherHint">{"空气提示"}</p>' +
			'</div>' +
			'<div id="show_fourth">' +
			'<p class="_show2_tomorrow _mg">{"日期3"}<span class="wind">风力:<span>{"风级3"}</p>' +
			'<p class="_mg">空气质量:<span class="atmosphere"><span>{"空气等级"}</span></span></p>' +
			'<p class="_mg"><span class="lastTemperature">最低气温:{"最低气温3"}</span><span>最高气温:{"最高气温3"}</span></p>' +
			'<p class="_img"><img src="https://xuesax.com/tianqiapi/skin/cake/{"图标3"}.png" ></p>' +
			'<p class="_temperature">{"最高气温2"}</p>' +
			'<p class="weatherChange">{"天气3"}</p>' +
			'<p class="_weatherHint">{"空气提示"}</p>' +
			'</div>';


		$('#div_weather').html(WeatherHtml.setobj(Weather));
	</script>
</html>
